/**
 * Created by GYL on 2018/7/25
 */
import React, { Component } from 'react';
import { Tabs, Tag, Icon, Divider, Modal, Popover, message, Card, Row, Col, DatePicker, Select, TreeSelect, Button } from 'antd';
import FiltrateUpgrade from '../../components/common/FiltrateUpgrade';
import Container from '../../components/common/Container';
import PublicService from '../../services/PublicService';
import MyModal from '../../components/common/MyModal';
import request from '../../utils/request';
import MyTable from '../../components/common/MyTable';
import MyPagination from '../../components/common/MyPagination';
import moment from 'moment';
import style from './Supply.less';
import AddModal from './sub/AddModal';
const confirm = Modal.confirm;
const Option = Select.Option;

const buttonWidth = 70;

class Supply extends Component {

    constructor(props) {
        super(props)
        this.columns = [
            {
                title: '序号',
                dataIndex: 'num',
                width: '5%',
                align: "center",

            },
            {
                title: '巡查人员',
                dataIndex: 'patrolPersonnelName',
                width: '6%',
                align: "center",

            },
            {
                title: '巡查任务',
                dataIndex: 'taskName',
                width: '10%',
                align: "center",
                render: (text) => <span>{text ? text : '/'}</span>
            },
            {
                title: '任务类型',
                width: '10%',
                dataIndex: 'taskType',
                align: "center",
                render: (text) => <span>{"供应站点检查"}</span>
            },
            {
                title: '预计完成时间',
                dataIndex: 'willFinishTime',
                width: '15%',
                align: "center",
            },
            {
                title: '实际完成时间',
                dataIndex: 'finishTime',
                width: '15%',
                align: "center",
            },
            {
                title: '操作',
                dataIndex: 'userName',
                width: '10%',
                align: "center",
                render: (text, record) => {
                    return <span>

                        <Tag color={record.finishType === '检查记录表' ? "#40a9ff" : "#ccc"} onClick={this.onCheck.bind(this, record)}>查看</Tag>
                    </span>

                }
            },

        ];

    }
    state = {
        addModal: false,
        EditId: "",
        totalArr: [],
        bottomArr: [],
        footerArr: [],
        moddleArr: [],
        headerArr: [],
        btn: "查看",
        customerName: "瓶装气供应站(点)安全检查考核评分表",
        page: 1,
        rows: 10,
        value: [],
        total: 0,
        loading: false,
        selectedRowKeys: [],
        selectedRows: [],
        dataSource: [],
        pageIndex: 1,
        pageSize: 10,
        status: "",
        gasStationName: "",
        endDateStr: null,
        startDateStr: null,
        tasktype: "",
        selectArr: []

    }

    componentDidMount() {

        request({
            url: `/zhrq-web/patrol/patroltask/getPatrolPersonnelList`,
            method: 'GET',

        }).then(data => {
            console.log(data)
            if (data.rc == 0) {
                this.setState({
                    selectArr: data.ret
                })
            }
        })


        this.onSubmit(1, 10)
    }


    //查询按钮
    onSubmit = (page, rows) => {
        this.setState({
            loading: true
        })



        let data = {
            page, rows,
            endDateStr: this.state.endDateStr == null ? "" : moment(this.state.endDateStr).format("YYYY-MM-DD HH:mm:ss"),
            patrolPersonnelId: this.state.patrolPersonnelId,
            startDateStr: this.state.startDateStr == null ? "" : moment(this.state.startDateStr).format("YYYY-MM-DD HH:mm:ss"),
            gasStationName: this.state.gasStationName,
            taskType: 1
        }
        request({
            url: '/zhrq-web/patrol/patroltask/getPageList',
            method: 'POST',
            data: data
        }).then(data => {

            data.ret.items.forEach((item) => {
                item.willFinishTime = moment(item.willFinishTime).format("YYYY-MM-DD HH:mm")

                if (item.finishTime) {
                    item.finishTime = moment(item.finishTime).format("YYYY-MM-DD HH:mm")
                }

            })
            if (data.rc === 0) {
                this.setState({
                    dataSource: data.ret.items,
                    total: data.ret.rowCount
                })
                setTimeout(() => {
                    this.setState({
                        loading: false
                    })
                }, 500)
            }
        })



    }


    //查看
    onCheck = (record) => {

        if (record.finishType === '检查记录表') {
            console.log(record)
            request({
                url: `/zhrq-web/report/bottledgasSupplystationScore/getBottledgasSupplystationScore?id=${record.reportId}`,
                method: 'GET',
            }).then(data => {
                if (data.rc == 0) {
                    data.ret.bottledgasSupplystationScoreInformationDtoList.forEach((item, index) => {
                        item.paramName = item.assessId
                        item.initialValue = item.score
                        item.disabled = true
                    })
                    data.ret.bottledgasSupplystationScoreVetoItemDtoList.forEach((item, index) => {
                        item.paramName = item.itemVetoId
                        item.initialValue = item.veto
                        item.disabled = true
                    })
                    if (data.ret.score === 0) {
                        data.ret.score = "0"
                    }

                    this.setState({
                        totalArr: [
                            {
                                name: "总分",
                                paramName: "score",
                                key: "1",
                                initialValue: data.ret.score,
                                disabled: true
                            }
                        ],
                        headerArr: [
                            {
                                name: "被检供应站名称",
                                paramName: "supplystation",
                                key: "1",
                                initialValue: data.ret.supplystation,
                                disabled: true
                            },
                            {
                                name: "被检查人",
                                paramName: "beInspector",
                                key: "2",
                                initialValue: data.ret.beInspector,
                                disabled: true
                            },


                        ],
                        bottomArr: [
                            {
                                type: 'input',
                                name: "检查考核人",
                                paramName: "assessor",
                                key: "1",
                                initialValue: data.ret.assessor,
                                disabled: true
                            },
                            {
                                type: "datePicker",
                                name: "检查考核时间",
                                paramName: "takeTime",
                                key: "2",
                                initialValue: moment(data.ret.takeTime),
                                disabled: true
                            }
                        ],
                        moddleArr: data.ret.bottledgasSupplystationScoreInformationDtoList,
                        footerArr: data.ret.bottledgasSupplystationScoreVetoItemDtoList,
                        addModal: true
                    })
                }
                console.log(data)
            })

        } else {
            return
        }

    }



    //分页器
    onChangePage = (page, size) => {
        this.onSubmit(page, size);
        this.setState({
            page,
            rows: size,
            pageIndex: page,
            pageSize: size
        })
    };


    //人员选取
    onSelect = (v, b) => {
        console.log(v, b)
        this.setState({
            patrolPersonnelId: v
        })
    }

    //时间选取狂
    onDatePicker = (v, b, c) => {
        console.log(v, b, c)
        this.setState({
            [v]: b
        })

    }

    //任务下拉选择
    onSelecttype = (v) => {
        this.setState({
            gasStationName: v
        })
    }

    ModalOk = () => {
        this.setState({
            addModal: false,

        })
    }

    ModalCancel = () => {
        this.setState({
            addModal: false,

        })
    }



    render() {
        const { treeData, total, loading, selectedRowKeys, dataSource, pageIndex, pageSize, addModal } = this.state
        const columns = this.columns


        let rowSelection = {
            selectedRowKeys,
            onChange: this.onSelectChange,
        };

        const windowWidth = document.body.clientWidth;

        const height = document.body.clientHeight;
        let containerHeight = '80vh';
        if (windowWidth > 1367) {
            containerHeight = '80vh';
        }

        return (
            <div >
                {
                    addModal &&
                    <AddModal
                        // type={type}
                        visible={addModal}
                        title={" "}
                        footerTitle={this.state.btn}
                        // modalBtnLoading={modalBtnLoading}
                        footerShow={false}
                        onModalSave={this.ModalOk}
                        onCancel={this.ModalCancel.bind(this, 'addModal')}
                        customerName={this.state.customerName}
                        headerArr={this.state.headerArr}
                        moddleArr={this.state.moddleArr}
                        footerArr={this.state.footerArr}
                        bottomArr={this.state.bottomArr}
                        totalArr={this.state.totalArr}
                    />
                }
                <Card className={style.topCard} bodyStyle={{ padding: 10 }}>

                    <Row style={{ paddingBottom: "-3px" }}>
                        <Col span={12} style={{ lineHeight: 1.5 }}> 检查考核时间 : <DatePicker value={this.state.startDateStr} size="small" onChange={this.onDatePicker.bind(this, "startDateStr")} /> 至  <DatePicker size="small" value={this.state.endDateStr} onChange={this.onDatePicker.bind(this, "endDateStr")} /> </Col>
                        <Col span={6}>

                            巡查人员 : <Select defaultValue="" style={{ width: 150 }} size="small" onChange={this.onSelect}>
                                <Option value={""}>全部</Option>
                                {this.state.selectArr &&
                                    this.state.selectArr.map((item, index) => {
                                        return (
                                            <Option key={index} value={item.id}>{item.name}</Option>
                                        )
                                    })
                                }

                            </Select>
                        </Col>
                        <Col span={4}>
                            <Button type="primary" size="small" onClick={this.onSubmit.bind(this, 1, 10)}>查询</Button>  <Button size="small">重置</Button>
                        </Col>
                        <Col span={24}><br /></Col>
                        <Col span={10}>

                            巡查任务 :  <Select defaultValue="" style={{ width: 150 }} size="small" onChange={this.onSelecttype}>
                                <Option value="">全部</Option>
                                <Option value="1">董家沟供应站</Option>
                                <Option value="2">南湖二供应站</Option>
                                <Option value="402881e9685eb23001685eb2a2490000">杨园村供应站</Option>
                                <Option value="402881e9685eb23001685eb303020001">何家垅供应站</Option>

                            </Select>
                        </Col>

                    </Row>


                </Card>
                <Container
                    style={{ height: containerHeight, position: "relative" }}
                    exportBtnShow={true}
                    exportBtn={this.exportBtn}
                >

                    <div style={{ height: "62vh", overflow: "auto" }}>
                        <MyTable
                            // bordered
                            loading={loading}
                            columns={columns}
                            // rowSelection={rowSelection}
                            pagination={false}
                            // scroll={{ y: windowWidth < 1400 ? height - 280 : height - 300 }}
                            dataSource={PublicService.transformArrayData(dataSource, true, true, pageIndex, pageSize)}
                        />

                    </div>
                    <MyPagination
                        showPage
                        pageSize={pageSize}
                        current={pageIndex}
                        total={total}
                        showSizeChanger
                        showQuickJumper
                        onChange={this.onChangePage}
                        onShowSizeChange={this.onChangePage}
                    />
                </Container>
            </div>
        )
    }
}
export default (Supply);
